<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Painter</title>
	<link rel="stylesheet" href="css/style.css">
</head>
<body>
	<div class="wrapper">
		<div class="title">
			<h1>你画我猜</h1>
		</div>
		<div class="main">
			<canvas id="canvas" width="960" height="500"></canvas>
			<div class="trash circle"></div>
			<div class="tools">
				<div class="color-picker-wrap">
					<div class="color-picker circle">
						<span class="color-item circle"></span>
						<span class="color-item circle"></span>
						<span class="color-item circle"></span>
						<span class="color-item circle"></span>
						<span class="color-item circle"></span>
						<span class="color-item circle"></span>
						<span class="color-item circle"></span>
					</div>

				</div>
				<div class="line-picker">
					<span class="line-item active" data-width="2"></span>
					<span class="line-item" data-width="5"></span>
					<span class="line-item" data-width="10"></span>
					<span class="line-item" data-width="20"></span>
					<span class="line-item" data-width="30"></span>
				</div>
				<div class="draw-mode">
					<div class="mode-item circle draw active" data-type="1"></div>
					<div class="mode-item circle eraser" data-type="2"></div>
				</div>
			</div>
		</div>
	</div>
	<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
	<script src="js/main.js"></script>
</body>
</html>
